<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
		
  <title>童星</title>
  <link rel="stylesheet" href="../css/mui.min.css"/>
  <link rel="stylesheet" href="../css/common.css" />
  <link rel="stylesheet" href="../iconfont/iconfont.css" />
  <link rel="stylesheet" href="../css/home.css" />
  <link rel="stylesheet" href="../css/category.css" />
  <link rel="stylesheet" href="../css/category.scroll.css" />
  <link rel="stylesheet" href="../css/discover.css" />
  <link rel="stylesheet" href="../css/cart.css" />
  <link rel="stylesheet" href="../css/member.css" />
  <style>
	.tab {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 50px;
    overflow: auto;
    background-color: #F1F1F1;
    height:-moz-calc(100% - 50px);
    height:-webkit-calc(100% - 50px);
    height: calc(100% - 50px);
  }
  </style>
</head>
<body>
	<div class="body-content">
    <div class="tab tab-0">
    	<!-- 顶部导航 开始 -->
			<header class="header mui-bar mui-bar-nav bar mui-text-center">
				<a class="mui-pull-left pad-h-md">
					童星桌椅
				</a>
				<a class="title"></a>
				<a class="mui-pull-right pad-h-md text-gray" data-url="product.search.html">
					<i class="iconfont icon-sousuo2"></i>
				</a>
			</header>
			<!-- 顶部导航 结束 -->

      <!--数据列表 开始-->
      <div class="spacing"></div>
			<div class="scroll">
				<!--数据列表-->
				<section class="mui-table-view mui-row scroll-data" data-tpl="tpl-template">						
					<!--轮播图 开始-->
					<div id="slider" class="mui-slider" >
						<div class="mui-slider-group mui-slider-loop">
							<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
							<div class="mui-slider-item mui-slider-item-duplicate">
								<a href="#">
									<img src="../image/home.png">
								</a>
							</div>
						</div>
					</div>
					<!--轮播图 结束-->
					
					<!--分类推荐 开始-->
					<div class="mui-row mui-text-center white pad-v featured-categories">
					</div>
					<!--分类推荐 结束-->
					
					<div class="pad-v-sm"></div>
					<!--广告区域 开始-->
					<div id="ad-area">
					</div>
					<!--广告区域 结束-->
					
					<div class="pad-v-sm"></div>
					<!--热门商品 开始-->
					<div class="white pad-v mui-text-center home-hr">
						 <div class="mgn-h-auto white mui-inline pad-h-sm">
						 	<i class="iconfont icon-tubiao"></i>
						 	<strong>热门商品</strong>
						 	<label class="text-gray">热卖好货必须哄抢</label>
						 </div>
					</div>
					<div class="mui-row mui-text-center white pad-v hot-products">
					</div>
					<!--热门商品 结束-->
					
					<div class="pad-v-sm"></div>
					<!--热门专题 开始-->
					<div class="mui-row white pad-v mui-text-center home-hr">
						 <div class="mgn-h-auto white mui-inline pad-h-sm">
						 	<i class="iconfont icon-huodong"></i>
						 	<strong>热门专题</strong>
						 	<label class="text-gray">热卖好货必须哄抢</label>
						 </div>
					</div>
					<div class="hot-topics">
					</div>
					<!--热门专题 结束-->
					
					<div class="pad-v-sm"></div>
					<!--热门活动 开始-->
					<div class="mui-row white pad-v mui-text-center home-hr">
						 <div class="mgn-h-auto white mui-inline pad-h-sm">
						 	<i class="iconfont icon-huodong"></i>
						 	<strong>热门活动</strong>
						 	<label class="text-gray">热卖好货必须哄抢</label>
						 </div>
					</div>
					<div class="hot-activities">
					</div>
					<!--热门活动 结束-->
				</section>
      </div>
			<!--数据列表 结束-->
			
			<!-- 商品轮播图片模板 开始 -->
			<script type="text/html" id="tpl-banner-slider">
				{{if data.slide && data.slide.length > 0}}
				<div class="mui-slider-group mui-slider-loop">
					<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="javascript:;">
							<img src="{{image(data.slide[data.slide.length-1].image)}}" data-type="{{data.slide[data.slide.length-1].type}}" data-value="{{data.slide[data.slide.length-1].type_val}}" />
						</a>
					</div>
					{{each data.slide as item idx}}
					<div class="mui-slider-item">
						<a href="javascript:;">
							<img src="{{image(item.image)}}" data-type="{{item.type}}" data-value="{{item.type_val}}" />
						</a>
					</div>
					{{/each}}
					<!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="javascript:;">
							<img src="{{image(data.slide[0].image)}}" data-type="{{data.slide[0].type}}" data-value="{{data.slide[0].type_val}}" />
						</a>
					</div>
				</div>
				{{/if}}
			</script>
			<!-- 商品轮播图片模板 结束 -->
			
			<!-- 商品分类模板 开始 -->
			<script type="text/html" id="tpl-category-row">
				{{each data.category as item}}
				<div class="mui-col-xs-3 category" data-id="{{item.category_id}}">
					<div class="mui-text-center">
						<img src="{{item.icon | image}}" />
					</div>
					<div>{{item.category_name}}</div>
				</div>
				{{/each}}
				<div class="mui-col-xs-3 more-category">
					<div class="mui-text-center">
						<i class="iconfont icon-shumiao icon-color-tuijian"></i>
					</div>
					<div>更多推荐</div>
				</div>
			</script>
			<!-- 商品分类模板 结束 -->
			
			<!-- 热门商品 开始 -->
			<script type="text/html" id="tpl-hot-product">
				{{each data.hot_goods as item}}
				<div class="white hot-product" data-id="{{item.id}}">
					<div class="hot-product-img">
						<img class="" src="{{item.thumb | image}}" />
					</div>
					<div class="hot-product-des">
						<div class="pad-v hot-product-key">
							{{item.title}}
						</div>
						<div class="text-gray pad-v">
							{{item.description}}
						</div>
					</div>
					<div class="hot-product-btn pad-h-md mui-text-left">
						<span class="bdr rds text-primary pad">
							￥{{item.goods_extend.goods_price | price}}
							<del class="text-gray mgn-h">￥{{item.goods_extend.goods_market_price | price}}</del>
						</span>
						<div class="mui-pull-right">
							<button class="text-gray no-mgn btn-awesome mui-hidden">
								<i class="iconfont icon-down">{{item.like}}</i>
							</button>
							<button class="text-gray no-mgn btn-view-detail">
								<i class="iconfont icon-feiji"></i>
							</button>
						</div>
					</div>
				</div>
				{{/each}}
			</script>
			<!-- 热门商品 结束 -->
			
			<!-- 热门专题 开始 -->
			<script type="text/html" id="tpl-hot-topic">
				{{each data.hot_special as item}}
				<div class="topic" data-id="{{item.id}}">
					<img src="{{item.thumb | image}}" />
					<div class="word pad-v-md pad-h rds">
						<div class="title">{{item.title}}</div>
						<div class="desc">{{item.description}}</div>
					</div>
				</div>
				{{/each}}
			</script>
			<!-- 热门专题 结束 -->
			
			<!-- 热门活动 开始 -->
			<script type="text/html" id="tpl-hot-activity">
				{{each data.hot_activity as item}}
				<div class="activity" data-id="{{item.id}}">
					<img src="{{item.thumb | image}}" />
					<div class="word pad-v-md pad-h rds">
						<div class="title">{{item.title}}</div>
						<div class="desc">{{item.description}}</div>
					</div>
				</div>
				{{/each}}
			</script>
			<!-- 热门活动 结束 -->
			
			
			<!--广告区域模板 开始-->
			<script type="text/html" id="tpl-ad">
				{{if 'one_three' == data.ad.show_type}}
				<div class="ad one-three white mui-row">
					<div class="mui-col-xs-6">
						{{if data.ad.image_ad}}
						<img src="{{image(data.ad.image_ad.image, '_0_300')}}" data-type="{{data.ad.image_ad.type}}" data-value="{{data.ad.image_ad.type_val}}"/>
						{{/if}}
					</div>
					<div class="mui-col-xs-6">
						{{each data.ad.ad as item idx}}
						{{if idx < 3}}
						<div class="pad-v-sm" data-type="{{item.type}}" data-value="{{item.type_val}}">
							<img class="mui-pull-right mgn-h-sm small-thumb" src="{{image(item.image, '_100_100')}}" />
							<div class="ad-title">{{item.title}}</div>
							<div class="ad-desc text-gray">{{item.description}}</div>
						</div>
						{{/if}}
						{{/each}}
					</div>
				</div>
				{{else if 'one_row' == data.ad.show_type}}
				{{each data.ad.ad as item idx}}
				<div class="ad one-row white mui-row pad-v-sm">
					<div class="mui-col-xs-4 big-thumb">
						<img src="{{image(item.image, '_100_100')}}" />
					</div>
					<div class="mui-col-xs-8" data-type="{{item.type}}" data-value="{{item.type_val}}">
						<div class="ad-title">{{item.title}}</div>
						<div class="ad-desc text-gray">{{item.description}}</div>
					</div>
				</div>
				{{/each}}
				{{else if 'one_four' == data.ad.show_type}}
				<div class="ad one-four white mui-row">
					<div class="mui-col-xs-6 big-thumb" data-type="{{data.ad.image_ad.type}}" data-value="{{data.ad.image_ad.type_val}}">
						<img src="{{image(data.ad.image_ad.image, '_200_200')}}" />
					</div>
					<div class="mui-col-xs-6">
						<div class="mui-row">
							{{each data.ad.ad as item idx}}
							{{if idx > 1 && 0 == idx%2 && idx != data.ad.ad.length}}
							<div class="mui-col-xs-12 gap"></div>
							{{/if}}
							{{if idx < 4}}
							<div class="mui-col-xs-6 small-thumb" data-type="{{item.type}}" data-value="{{item.type_val}}">
								<img src="{{image(item.image, '_100_100')}}" />
							</div>
							{{/if}}
							{{/each}}
						</div>
					</div>
				</div>
				{{else if 'one_one' == data.ad.show_type}}
				<div class="ad one-one white mui-row">
					{{each data.ad.ad as item idx}}
					{{if 0 == idx%2 && idx != data.ad.ad.length}}
					<div class="mui-col-xs-12 gap"></div>
					{{/if}}
					<div class="mui-col-xs-6 mui-text-center" data-type="{{item.type}}" data-value="{{item.type_val}}">
						<img class="small-thumb" src="{{image(item.image, '_0_100')}}" />
					</div>
					{{/each}}
				</div>
				{{else if 'one_two_up_down' == data.ad.show_type}}
				<div class="ad one-two-up-down white mui-row">
					<div class="mui-col-xs-6 big-thumb">
						{{if data.ad.image_ad}}
						<img src="{{image(data.ad.image_ad.image, '_200_200')}}" data-type="{{data.ad.image_ad.type}}" data-value="{{data.ad.image_ad.type_val}}"/>
						{{/if}}
					</div>
					<div class="mui-col-xs-6">
						{{each data.ad.ad as item idx}}
						{{if idx < 2}}
						<div class="small-thumb" data-type="{{item.type}}" data-value="{{item.type_val}}">
							<img src="{{image(item.image, '_200_0')}}" />
						</div>
						{{/if}}
						{{/each}}
					</div>
				</div>
				{{/if}}
			</script>
			<!--广告区域模板 开始-->
    </div>
    <div class="tab tab-1">
      <!-- 顶部导航 开始 -->
      <div class="mui-row mui-text-center search">
        <input type="search" class="no-mgn no-pad" placeholder="">
        <i class="iconfont icon-sousuo">儿童学习桌</i>
        <button class="search-btn no-bdr">搜索</button>
      </div>
      <!-- 顶部导航 结束 -->
      <div class="mui-row mui-text-center all-classify btn-view-all">
        <label class="mui-col-xs-12">全部分类</label>
      </div>
      <div class="spacing"></div>
      <div class="spacing"></div>
      <div class="scroll">
      	<!--分类数据 开始-->
				<!--数据列表-->
				<section class="mui-table-view mui-row scroll-data" data-tpl="tpl-categories" id="pnl-categories">
				</section>
				<!--分类数据 结束-->
				
			    <!-- 分类模板 开始 -->
				<script type="text/template" id="tpl-categories">
					{{each data as item}}
					<!--一级分类 开始-->
					<div class="mui-row mui-text-center classify">
						<img class="mui-col-xs-12 classify-bg" src="{{item.thumb | image}}" />
						<div class="mui-col-xs-12 mui-block mgn-v-lg classify-level">
							<label class="mui-col-xs-5 pad-v-sm">{{item.name}}</label>
							<div class="mui-col-xs-12 mgn-v-sm">
								{{each item.child as child idx}}
								{{if idx < 3}}
								<label class="mui-col-xs-4 mgn-h category pad-v-sm" data-id="{{child.id}}">{{child.name}}</label>
								{{/if}}
								{{/each}}
							</div>
							<div class="classify-btn">
								<button class="mui-col-xs-5 no-rds mgn-v-sm btn-view-all category" data-id="{{item.id}}">查看全部</button>
							</div>
						</div>
					</div>
					<!--一级分类 结束-->
				
					<!--二级分类 开始-->
					<div class="mui-row mui-text-center second classify-second">
						<div class="sanjiaoxing"></div>
						{{each item.child as child idx}}
						<div class="mui-col-xs-3 mgn-v-sm category pad-v-sm" data-id="{{child.id}}">{{child.name}}</div>
						{{/each}}
					</div>
					<!--二级分类 结束-->
					{{/each}}
				</script>
			  <!-- 分类模板 结束 -->
      </div>
    </div>
    <div class="tab tab-2">
      <!-- 顶部导航 开始 -->
      <header class="header mui-bar mui-bar-nav bar mui-text-center">
        <a class="title">发现</a>
      </header>
      <!-- 顶部导航 结束 -->
      <div class="spacing"></div>
      <div class="mui-row white pad-h-md pad-v-sm" data-url="discover.topic.html">
        <i class="iconfont icon-1373zhuanti"></i>
        <label>热门专题</label>
        <i class="iconfont icon-right mui-pull-right"></i>
      </div>
      <div class="mui-row white pad-h-md mgn-v-sm pad-v-sm" data-url="discover.activity.html">
        <i class="iconfont icon-huodong"></i>
        <label>活动</label>
        <i class="iconfont icon-right mui-pull-right"></i>
      </div>
    </div>
    <div class="tab tab-3">
      <!-- 顶部导航 开始 -->
      <header class="header mui-bar mui-bar-nav bar mui-text-center">
        <a class="mui-pull-left"></a>
        <a class="title">购物车</a>
      </header>
      <!-- 顶部导航 结束 -->

      <!--购物车数据列表 开始-->
      <div class="mui-content mui-scroll-wrapper container-pull-refresh no-pad">
        <div class="mui-scroll">
          <div class="spacing"></div>
          
          <!--数据列表-->
          <section class="mui-table-view mui-row scroll-data" data-tpl="tpl-cart">
          </section>
        </div>
      </div>
      <!--购物车数据列表 结束-->
      
      <div class="mui-row checkout-row">
        <div class="mui-col-xs-4">
          <div class="mui-input-row mui-checkbox mui-left">
            <label>全选</label>
            <input name="cart-select-all" value="1" type="checkbox">
          </div>
        </div>
        <div class="mui-col-xs-8">
          <div class="mui-row">
            <div class="mui-col-xs-7">
              合计：<span class="text-primary cart-total">￥0.00</span>
            </div>
            <div class="mui-col-xs-5 h-full">
              <button type="button" class="mui-btn mui-btn-danger mui-pull-right mgn-h-md btn-go-checkout">去结算</button>
            </div>
          </div>
        </div>
      </div>
      
      <!-- 购物车商品模板 开始 -->
      <script type="text/html" id="tpl-cart">
        {{each data as item}}
        <div class="mui-row cart-item white" data-cart="{{item.cart_id}}" data-product="{{item.goods_id}}" data-price="{{item.goods_price}}" data-max="{{item.goods_storage}}">
          <div class="mui-col-xs-2">
            <div class="mui-input-row mui-checkbox mgn-v-lg">
              <label> </label>
              <input name="product" type="checkbox">
            </div>
          </div>
          <div class="mui-col-xs-3 thumbnail">
            <img src="{{item.thumb | thumb}}" />
          </div>
          <div class="mui-col-xs-7 pad-v-sm">
            <div>{{item.title}}</div>
            <div class="mgn-v-sm">
              <span class="text-primary">￥{{item.goods_price | price}}</span>
              <span class="mui-pull-right pad-h-md btn-trash">
                <i class="iconfont icon-trash"></i>
              </span>
            </div>
            <div class="mui-numbox" data-numbox-min="1">
              <!-- "-"按钮，点击可减小当前数值 -->
              <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
              <input class="mui-numbox-input" type="number" name="quantity" value="{{item.goods_num}}" />
              <!-- "+"按钮，点击可增大当前数值 -->
              <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
            </div>
          </div>
        </div>
        {{/each}}
      </script>
      <!-- 购物车商品模板 结束 -->
    </div>
    <div class="tab tab-4">
      <div class="mui-text-right pad-h pad-v">
      <i class="iconfont icon-04bianji" data-private="member.setting.html"></i>
    </div>
    <div class="scroll">
      <div class="mui-text-center avatar">
        <img src="../image/icon-no-image.png" data-private="member.setting.html" />
      </div>
      <div class="mui-text-center">
        <span>
        <label class="mui-block nickname">未登录</label>
        <label class="mui-block hobby">&nbsp;</label>
      </span>
      </div>
      <div class="mui-row member-list btn-ally">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-haoyou2 text-distribution"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>我的分销</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.order.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-xinfeng text-oder"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>我的订单</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.groupon.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-renzhengtubiao text-coupon"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>优惠劵</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.address.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-dizhi text-address"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>收货地址管理</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.activity.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-feiji text-activity"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>我参与的活动</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.after.sale.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-shouhouxiaoxi0 text-customer-service"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>我的售后</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.comment.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-pinglun1 text-comment"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>我的评论</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.collection.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-iconfontwujiaoxing text-collection"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>我的收藏</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="about.us.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-tuandui text-about"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>关于我们</label>
        </div>
      </div>
      <div class="mui-row member-list" data-private="member.setting.html">
        <div class="mui-col-xs-2 mui-text-center">
          <i class="iconfont icon-setting text-setup"></i>
        </div>
        <div class="mui-col-xs-10">
          <label>系统设置</label>
        </div>
      </div>
    </div>
  </div>
  <footer>
   <!-- 通用导航  开始 -->
   <nav class="mui-bar mui-bar-tab static">
    <a class="mui-tab-item">
     <span class="mui-icon icon iconfont icon-home"></span>
     <span class="mui-tab-label">首页</span>
    </a>
    <a class="mui-tab-item">
     <span class="mui-icon icon iconfont icon-list"></span>
     <span class="mui-tab-label">分类</span>
    </a>
    <a class="mui-tab-item">
     <span class="mui-icon icon iconfont icon-faxian0"></span>
     <span class="mui-tab-label">发现</span>
    </a>
    <a class="mui-tab-item">
     <span class="mui-icon icon iconfont icon-gouwuche"></span>
     <span class="mui-tab-label">购物车</span>
    </a>
    <a class="mui-tab-item">
     <span class="mui-icon icon iconfont icon-yonghuming"></span>
     <span class="mui-tab-label">我</span>
    </a>
   </nav>
  <!-- 通用导航  结束 -->
  </footer>	
	<script type="text/javascript" src="../js/mui.min.js" ></script>
	<script type="text/javascript" src="../js/jquery.min.js" ></script>
  <script type="text/javascript" src="../js/jquery.ba-bbq.min.js"></script>
	<script type="text/javascript" src="../js/template.js" ></script>
  <script type="text/javascript" src="../js/jweixin-1.0.0.js" ></script>
	<script type="text/javascript" src="../js/app.js" ></script>
	<script type="text/javascript" src="home.js" ></script>
  <script type="text/javascript" src="category.js"></script>
  <script type="text/javascript" src="category.scroll.js"></script>
  <script type="text/javascript" src="discover.js"></script>
  <script type="text/javascript" src="member.js"></script>
  <script type="text/javascript" src="cart.js"></script>
</body>
</html>